<template>
	<view>
		<view v-if="mode=='newLogin'">
			<view class="CountDownViewNew_newLogin" @tap="getCode" v-if="canCode">获取验证码</view>
			<view class="CountDownViewNew_newLogin sendCode_newLogin" v-else>{{secondsShow}}s后重获</view>
		</view>
		<view v-else-if="mode=='newTestdriver'">
			<view class="CountDownViewNew_newTestdriver" @tap="getCode" v-if="canCode">获取验证码</view>
			<view class="CountDownViewNew_newTestdriver sendCode_newTestdriver" v-else>{{secondsShow}}s后重获</view>
		</view>
		<view v-else-if="mode=='bindCar'">
			<view class="CountDownViewBindCar" @tap="getCode" v-if="canCode">获取验证码</view>
			<view class="CountDownViewBindCar sendCode" v-else>{{secondsShow}}s后重获</view>
		</view>
		<view v-else>
			<view class="CountDownView" @tap="getCode" v-if="canCode">获取验证码</view>
			<view class="CountDownView sendCode" v-else>{{secondsShow}}s后重获</view>
		</view>
	</view>
</template>


<script>
	const app = getApp()

	export default {
		data() {
			return {
				canCode: true,
				name: '',
				timer: null,
				secondsShow:60
			};
		},
		options: {
			styleIsolation: 'shared'
		},
		props: {
			seconds: { // 属性名（父组件传的值）
				type: Number, // 类型（必填），目前接受的类型包括：String, Number, Boolean, Object, Array, null（表示任意类型）
				value: 60 ,// 属性初始值（可选），如果未指定则会根据类型选择一个
				default: 60 
			},
			
			mode: {
				type: String,
				value: '',
				default: ''
			},
		},
		methods: {
			// 这里放置自定义方法  
			getCode: function() {
				var that = this;

				that._countStartEvent();
				// //调取
				// that.startCount()
			},
			startCount: function() {
				var that = this;
				var second = that.secondsShow;
				second--;
				that.secondsShow = second
				that.canCode = false

				if (second < 1) {
					clearTimeout(this.timer);
					that._countEndEvent();
					that.secondsShow = 60
					that.canCode = true
					return
				}
				this.timer = setTimeout(function() {
					that.startCount();
				}, 1000);
			},
			stopCount: function() {
				var that = this;
				clearTimeout(this.timer);
				that.secondsShow = 0
				that.canCode = true
			},
			_countStartEvent: function() {
				this.$emit('countStartEvent')
			},
			_countEndEvent: function() {
				this.$emit('countEndEvent')
			}
		}



	}
</script>
<style>
	@import "./CountDownView.css";
</style>
